body {
  width: 100%;
}
.box1 {
  width: 100%;
}
.box1 .box1_head {
  background: -webkit-gradient(linear, left top, right top, from(#00aaff), to(#0086ff));
  background: linear-gradient(90deg, #00aaff, #0086ff);
  height: 5.33333333rem;
}
.box1 .box1_head .site {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 0.86666667rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.box1 .box1_head .site .city {
  width: 65%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.box1 .box1_head .site .city img {
  margin: 0 0.2rem;
  width: 0.4rem;
  height: 0.4rem;
}
.box1 .box1_head .site .city h6 {
  font-size: 0.32rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #ffffff;
}
.box1 .box1_head .site .weath {
  margin: 0 0.3rem;
  width: 15%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.box1 .box1_head .site .weath section p {
  font-size: 0.33333333rem;
  color: #fff;
}
.box1 .box1_head .site .weath i {
  font-size: 0.53333333rem;
  color: green;
}
.box1 .box1_head .search {
  width: 100%;
  height: 1.13333333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 999;
}
.box1 .box1_head .search p {
  width: 80%;
  background: #fff;
  text-align: center;
  height: 0.8rem;
  font-size: 0.26666667rem;
  line-height: 0.8rem;
}
.box1 .box1_head ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 0.66666667rem;
  font-size: 0.2rem;
  line-height: 0.66666667rem;
}
.box1 .box1_head ul li {
  width: 12.5%;
  text-align: center;
  color: #fff;
}
.box1 .nav {
  position: relative;
  background: #fff;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #000;
  height: 3.2rem;
}
.box1 .nav .swiper-container {
  width: 100%;
  height: 3.2rem;
  position: absolute;
  left: 0;
  top: 0;
}
.box1 .nav .swiper-slide {
  background-position: center;
  background-size: cover;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.box1 .nav .swiper-slide dl {
  width: 25%;
  height: 1.33333333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.box1 .nav .swiper-slide dl dd img {
  width: 0.93333333rem;
  height: 0.93333333rem;
}
.box1 .nav .swiper-slide dl dt p {
  font-size: 0.26666667rem;
}
.box1 .banner img {
  width: 90%;
  margin: 5%;
}
.box1 .hot {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 95%;
  margin: 0 auto;
}
.box1 .hot .hot_one {
  width: 43%;
  margin: 1%;
  background: #eee;
  padding: 0 0 0 5%;
}
.box1 .hot .hot_one h3 {
  font-size: 0.29333333rem;
  color: red;
  line-height: 0.53333333rem;
}
.box1 .hot .hot_one h4 {
  line-height: 0.4rem;
  font-size: 0.21333333rem;
  color: #aaa;
}
.box1 .hot .hot_one p {
  font-weight: 900;
  font-size: 0.21333333rem;
}
.box1 .hot .hot_one p span {
  color: red;
  line-height: 0.4rem;
}
.box1 .hot .hot_one figure {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.box1 .hot .hot_one figure img {
  width: 2rem;
  height: 1.73333333rem;
}
.box1 .hot .hot_two {
  width: 43%;
  margin: 1%;
  background: #eee;
  padding: 0 0 0 5%;
}
.box1 .hot .hot_two h3 {
  font-size: 0.29333333rem;
  line-height: 0.53333333rem;
}
.box1 .hot .hot_two h4 {
  line-height: 0.4rem;
  font-size: 0.21333333rem;
  color: #aaa;
}
.box1 .hot .hot_two p {
  font-weight: 900;
  font-size: 0.21333333rem;
  color: #b18564;
}
.box1 .hot .hot_two figure {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.box1 .hot .hot_two figure img {
  width: 2rem;
  height: 1.73333333rem;
}
.box1 .hot .hot_three {
  width: 31%;
  text-align: center;
  margin: 1%;
  background: #eee;
}
.box1 .hot .hot_three h3 {
  font-weight: 900;
  font-size: 0.29333333rem;
  text-align: center;
  line-height: 0.4rem;
}
.box1 .hot .hot_three span {
  display: inline-block;
  color: red;
  font-size: 0.21333333rem;
  line-height: 0.4rem;
}
.box1 .hot .hot_three img {
  width: 1.57333333rem;
  height: 1rem;
}
.box1 .hot .hot_four {
  width: 31%;
  text-align: center;
  margin: 1%;
  background: #eee;
}
.box1 .hot .hot_four h3 {
  font-weight: 900;
  font-size: 0.29333333rem;
  text-align: center;
  line-height: 0.4rem;
}
.box1 .hot .hot_four span {
  display: inline-block;
  font-size: 0.17333333rem;
  line-height: 0.4rem;
}
.box1 .hot .hot_four img {
  width: 1.57333333rem;
  height: 1rem;
}
.box1 .hot .hot_five {
  width: 31%;
  text-align: center;
  margin: 1%;
  background: #eee;
}
.box1 .hot .hot_five h3 {
  font-weight: 900;
  font-size: 0.29333333rem;
  text-align: center;
  line-height: 0.4rem;
}
.box1 .hot .hot_five span {
  display: inline-block;
  font-size: 0.21333333rem;
  line-height: 0.4rem;
}
.box1 .hot .hot_five img {
  width: 1.57333333rem;
  height: 1rem;
}
.box1 .tuijian {
  font-size: 0.33333333rem;
  padding: 0 5%;
  line-height: 0.53333333rem;
}
.box1 .shopList {
  width: 95%;
  margin: 0 auto;
  margin-bottom: 1.2rem;
}
.box1 .shopList .shops_1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.box1 .shopList .shops_1 .shop1_fig img {
  width: 1.46666667rem;
  margin-top: 0.13333333rem;
  height: 1.46666667rem;
}
.box1 .shopList .shops_1 div {
  margin-left: 5%;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.box1 .shopList .shops_1 div h3 {
  font-size: 0.29333333rem;
  line-height: 0.6rem;
  font-weight: bolder;
}
.box1 .shopList .shops_1 div p {
  font-size: 0.2rem;
  line-height: 0.46666667rem;
  color: #2A2525;
}
.box1 .shopList .shops_1 div p span {
  color: skyblue;
}
.box1 .shopList .shops_1 div .dis {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 0.2rem;
  line-height: 0.46666667rem;
}
.box1 .shopList .shops_1 div .dis span {
  color: red;
}
.box1 .shopList .shops_1 div .shops_2 {
  border-top: 1px solid #ccc;
  margin-top: 0.13333333rem;
}
.box1 .foot {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 1.33333333rem;
  position: fixed;
  bottom: 0;
  left: 0;
  background: #fff;
  color: #444;
  width: 100%;
}
.box1 .foot section {
  width: 25%;
  text-align: center;
  padding-top: 0.2rem;
}
.box1 .foot section i {
  font-size: 0.53333333rem;
}
.box1 .foot section p {
  font-size: 0.26666667rem;
}
.box1 .foot .foot_active {
  color: red;
}
.box2 {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
  width: 100%;
  height: 100%;
  background: #eee;
  z-index: 999;
}
.box2 .box2_head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: -webkit-gradient(linear, left top, right top, from(#00aaff), to(#0086ff));
  background: linear-gradient(90deg, #00aaff, #0086ff);
  height: 0.66666667rem;
}
.box2 .box2_head p {
  font-size: 0.53333333rem;
  color: #fff;
  margin: 0 3%;
}
.box2 .box2_head h3 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 0.29333333rem;
  color: #fff;
  text-align: center;
}
.box2 .box2_sear {
  background: #fff;
  height: 0.93333333rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.box2 .box2_sear input {
  width: 90%;
  height: 0.66666667rem;
  border-radius: 0.13333333rem;
  outline: none;
  -webkit-appearance: none;
  border: none;
  background: #eee;
  text-indent: 0.33333333rem;
  color: #aaa;
}
.box2 .box2_site {
  background: #fff;
}
.box2 .box2_site p {
  width: 100%;
  text-indent: 0.33333333rem;
  line-height: 0.66666667rem;
  background: #eee;
  font-size: 0.26666667rem;
  color: #4A4A51;
}
.box2 .box2_site h4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-indent: 0.33333333rem;
  line-height: 0.8rem;
  font-size: 0.37333333rem;
  font-weight: 600;
  background: #fff;
}
.box2 .box2_site h4 span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  font-size: 0.29333333rem;
  color: #2395ff;
  font-weight: 300;
}
.box2 .box2_site h4 span i {
  margin: 0 4%;
  font-size: 0.4rem;
}
